<script setup>
const props = defineProps({
  count: {
    type: Number,
    required: true
  }
})
// 使用 defineEmits 定义事件
const emit = defineEmits(['change'])
const page = ref(1)
const pageSize = ref(10)
const displayOrder = ['size-picker', 'pages']

function changePage() {
  emit('change', page.value, pageSize.value)
}
</script>

<template>
  <n-pagination v-if="count > 0" v-model:page="page" v-model:page-size="pageSize" :page-sizes="[10, 20, 30, 50]" :item-count="props.count" :display-order="displayOrder" show-size-picker @update-page="changePage" @update-page-size="changePage" />
</template>
